import React from 'react';
import { Result, Icon, WhiteSpace } from 'antd-mobile';
import './payOver.css'

class PayOver extends React.Component {
    constructor(props){
        super(props)
        this.state={
            time:''
        }
    }
    componentDidMount = () => {
		this.countDown(5);//倒计时时间可随意调整，且可读性强
    };
	countDown = (waitTime) => {
        if (waitTime > 0) {
            waitTime--;
           this.setState({
               time:waitTime
           })
        } else {
            this.props.history.push('/Home')
            return;
        }
        setTimeout(() => {
            this.countDown(waitTime);
        }, 1000);
	}
    ResultExample = () => (<div className="result-example">
        <div className="sub-title">支付成功</div>
        <Result
            img={<Icon type="check-circle" className="spe" style={{ fill: '#1F90E6' }} />}
            title="支付成功"
            // message={<div>998.00元 <del>1098元</del></div>}
            message={<div>25.00元</div>}
        />
        <p>{this.state.time}秒之后返回主页</p>
        <WhiteSpace />
    </div>);
    render() {
        return (
            <div>
                {this.ResultExample()}
            </div>
        )
    }
}

export default PayOver